import { Switch } from '@kedacom/react-next'

import shallow from 'zustand/shallow'
import { useMeetingAiStore } from './store'
import { StyledWrap } from './style'
import LabelWrap from '../../components/LabelWrap'
import { t } from 'i18next'

export default function MeetingAi() {
	const { update, record, sign, subtitle } = useMeetingAiStore(
		(state) => ({
			update: state.update,
			record: state.record,
			sign: state.sign,
			subtitle: state.subtitle,
		}),
		shallow
	)
	return (
		<StyledWrap className="ai">
			<LabelWrap label={t('会议纪要')}>
				<Switch
					width={40}
					height={22}
					className="video"
					checked={Boolean(record)}
					onChange={(e, v) => {
						update({ record: v ? 1 : 0 })
					}}
				></Switch>
			</LabelWrap>
			<LabelWrap label={t('同声字幕')}>
				<Switch
					width={40}
					height={22}
					className="video"
					checked={Boolean(subtitle)}
					onChange={(e, v) => {
						update({ subtitle: v ? 1 : 0 })
					}}
				></Switch>
			</LabelWrap>
			<LabelWrap label={t('会议签到')}>
				<Switch
					width={40}
					height={22}
					className="video"
					checked={Boolean(sign)}
					onChange={(e, v) => {
						update({ sign: v ? 1 : 0 })
					}}
				></Switch>
			</LabelWrap>
		</StyledWrap>
	)
}
